<template>
    <div class="containers">
        <div class="header">
            <img @click="goHome" src="../assets/images/pic_img2/btn_home.png" alt="">
            <img @click="goReturn" src="../assets/images/pic_img2/btn_return.png" alt="" style="margin-left: 37px;">
        </div>
        <div class="centers">
            <div>
                <div>台 位：</div>
                <div>{{ datas.positionName }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>股 道：</div>
                <div>{{ datas.trackName }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>车列号：</div>
                <div>{{ datas.complete == 1 ? datas.oneColumn : datas.twoColumn }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>作业班组：</div>
                <div>{{ datas.team }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>班组人员：</div>
                <div>{{ datas.teamUser }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>开始时间：</div>
                <div>{{ datas.startTime }}</div>
            </div>
            <div class="lines"></div>
            <div>
                <div>结束时间：</div>
                <div>{{ datas.endTime }}</div>
            </div>
            <div class="lines"></div>
        </div>
        <!-- <div class="beginButton" @click="beginWorks" v-if="workStatus == 1">
            <img src="../assets/images/pic_img7/start_zy.png" alt="">
        </div> -->
        <div class="beginButton" @click="endWorks">
            <img src="../assets/images/pic_img7/end_zy.png" alt="">
        </div>
        <div class="footers">Copyright © 2025 动车入库作业智能登销记系统</div>
    </div>
</template>
<script>
import { startWork, btnEndClick1, machineend, carloadBtnEndClick } from '@/api/home'
export default {
    data() {
        return {
            datas: {},
            workStatus: null,
            types: null
        }
    },
    created() {
        this.datas = JSON.parse(this.$route.query.datas);
        this.workStatus = this.$route.query.workStatus
        this.types = this.$route.query.type
    },
    methods: {
        endWorks() {
            if (this.types) {
                carloadBtnEndClick(this.datas).then(res => {
                    this.$router.push("/login")
                })
            } else {
                if (this.workStatus == 2) {
                    btnEndClick1(this.datas).then(res => {
                        this.$router.push("/login")
                    })
                } else if (this.workStatus == 3) {
                    machineend(this.datas).then(res => {
                        this.$router.push("/login")
                    })
                }
            }

        },
        beginWorks() {
            startWork(this.datas).then(res => {
                this.$router.push("/login")
            })
        },
        goReturn() {
            this.$router.go(-1)
        },
        goHome() {
            this.$router.push("/login")
        }
    }
}
</script>
<style lang="scss" scoped>
.containers {
    width: 100%;
    height: 100%;
    background-image: url("../assets/images/pic_img2/track_bg.jpg");
    background-size: cover;
    position: relative;

    .header {
        position: absolute;
        left: 569px;
        top: 186px;
    }

    .beginButton {
        width: 288px;
        height: 95px;
        margin: auto;
        position: absolute;
        left: calc((100% - 288px) / 2);
        top: 1450px;
    }

    .centers {
        background: #fff;
        width: 960px;
        height: 1042px;
        position: absolute;
        left: calc((100% - 960px) / 2);
        top: 345px;

        >div {
            height: 148px;
            line-height: 148px;
            display: flex;
            align-items: center;
            font-size: 30px;
            font-weight: bold;
            font-family: Microsoft YaHei Bold;

            >div:first-child {
                width: 200px;
                margin-left: 100px;
            }

            >div:last-child {
                color: #2757B0;
                margin-left: 50px;
            }

        }

        .lines {
            width: 100%;
            height: 1px;
            background: #dcdcdc;
        }
    }
}
</style>